<!-- 
咨询记录 
-->
<template>
    <ElSelect filterable clearable :="$attrs">
        <ElOption v-for="item in options" :key="item.zxid" :label="item.zxkhmc" :value="item.zxid" />
    </ElSelect>
</template>

<script setup lang="ts">
import { ref, onMounted, watch } from 'vue'
import { ElSelect, ElOption } from 'element-plus'
import { getConsultationListByCustomerView, getConsultationInfoById } from '../api'

interface Props {
    data: any;
}
const props = withDefaults(defineProps<Props>(), {
    data: () => ({}),
})

const options = ref<Array<{ zxkhmc: string, zxid: string }>>([])

const getOptions = () => {
    getConsultationListByCustomerView({})
        .then(res => {
            options.value = res
        })
}

onMounted(() => {
    getOptions()
})

watch(() => props.data.zxid, () => {
    // 根据咨询记录ID查询该咨询记录信息
    const zxid = props.data.zxid;
    if (props.data.once === undefined || props.data.once === false) {
        getConsultationInfoById({ zxid })
            .then(res => {
                props.data.khmc = res.zxkhmc;
                props.data.tklxVal = res.zxkhlxVal;
                props.data.tklxName = res.zxkhlxName;
                props.data.tkqdVal = res.zxtkqdVal;
                props.data.tkqdName = res.zxtkqdName;
                props.data.once === false;
            })
    }

    if (props.data.once === true) {
        props.data.once = false
    }
})
</script>